﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title>求职者信息管理</title>
    <link href="/js/bstable/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="/js/bstable/css/bootstrap-table.css" rel="stylesheet" type="text/css">
    <link href="/css/table.css" rel="stylesheet" type="text/css">

    <script src="/js/vue.js"></script>
    <script src="/js/axios.min.js"></script>
</head>
<body style="background-color: #ecf0f5;font-family: 微软雅黑;color: #475059;min-width: 1000px;overflow: auto">
<div id="app">


<script src="/js/jquery/jQuery-2.2.0.min.js"></script>
<script src="/js/bstable/js/bootstrap.min.js"></script>
<script src="/js/bstable/js/bootstrap-table.js"></script>
<script src="/js/bstable/js/bootstrap-table-zh-CN.min.js"></script>
<script src="/js/layer_v2.1/layer/layer.js"></script>

    <table class="table table-bordered  table-hover">
        <div class="notice_check">

            <div class="l_left">
                <input type="text" v-model="appName" name="appName" class="form-control" placeholder="请输入姓名">


            </div>
            <button type="button" @click="queryApp()" class="btn btn-primary">查询</button>

        </div>
        <tr>
        <th><label>
            <input type="checkbox"   id="inlinecheckbox1" value="true" >
        </label></th>
        <th> 编号 </th>
        <th> 账号 </th>
        <th>姓名</th>
        <th> 密码 </th>
        <th> 注册日期 </th>
        <th> 状态 </th>
        <th>操作</th>
        <th>操作</th>
    </tr>
    <tr v-for="(item,index) in pageInfo.list">
        <td><label>
            <input type="checkbox"   id="inlinecheckbox1" value="true" >
        </label></td>
        <td> {{index+1}} </td>
        <td> {{item.applicant_number}} </td>
        <td> {{item.applicant_name}} </td>
        <td> {{item.applicant_pass}} </td>
        <td> {{item.applicant_creatdate}} </td>
        <td > {{item.state}} </td>
        <td> <a   @click="delApp(item.applicant_id)">删除</a></td>
        <td> <a   @click="lookUp(item.applicant_id)">查看详情</a></td>

    </tr>
</table>
    <nav aria-label="Page navigation">
        <ul class="pagination">
            <li @click="getPreviousPageData(pageInfo.pageNum)">
                <a href="#" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>
            <li :class="pageInfo.pageNum==num?'active':''" @click="getPageData(num)" v-for="num in pageInfo.navigatepageNums">
                <a>{{num}}</a>
            </li>
            <li @click="getNextPageData(pageInfo.pageNum)">
                <a href="#" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
        </ul>
    </nav>
</div>
</body>
</html>
<script>
    new Vue({
        el:"#app",
        data:{
            appName:'',
            pageInfo:[]   //返回了PageInfo对象，包含了分页信息
         },
        methods:{
            queryApp:function (){
                _this = this
                //查询求职者信息
                axios.get('/app/list1/1',{
                    params: {
                        appName:this.appName
                    }
                }).then(function (response) {
                    _this.pageInfo=response.data.object;
                    console.log(response.data);
                })
                    .catch(function (error) {
                        console.log(error);
                    });
            },

            delApp:function (applicant_id){
                // alert(applicant_id)
                window.localStorage.setItem("sid", applicant_id);
                location.href="applicant2.html"
                axios.get('/app/del',{
                    params:{
                        applicant_id: applicant_id
                    }
                }).then(function (response){
                    console.log(response.data);
                })
                    .catch(function (error){
                        console.log(error);
                    });
            },
            getPreviousPageData:function(num){
                num--;
                if(num<1){
                    return;
                }
                this.getPageData(num)
            },
            getNextPageData:function(num){
                num++;
                if(num>this.pageInfo.pages){
                    return;
                }
                this.getPageData(num)
            },
            getPageData:function (num){
                _this = this
                axios.get('/app/list1/'+num,{
                    params: {
                        appName: this.appName

                    }
                }).then(function (response){
                    console.log(response.data);
                    _this.pageInfo=response.data.object;

                })
                    .catch(function (error){
                        console.log(error);
                    });
            },
            lookUp:function (applicant_id){
                window.localStorage.setItem("applicant_id",applicant_id);
                // alert(applicant_id)
                location.href="postItemR.html"
            }


            },

        mounted() {
            this.getPageData(1)

            _this = this
            axios.get('/app/list1',{
                params: {
                    appName: this.appName

                }
                }).then(function (response){
                _this.appList=response.data;
                console.log(response.data);
            })
            .catch(function (error){
                console.log(error);
            });
        }
    })
</script>
